<!DOCTYPE html>
<!--<iframe name="demo2" marginwidth="0"	marginheight="0" width="100%" height="400", src="demo2.html" frameborder="0"></iframe>-->
<!-- data -->
<script src="allData.js"></script>
<!-- vue -->
<script type="text/jscript" src="../js/vue.js"></script>
<!-- iView UI-->
<script type="text/jscript" src="../js/iView.js"></script>
<link rel="stylesheet" href="../css/iView.css" />
<script type="text/javascript" src="../js/YTYanKPrivate.js"></script>
<link rel="stylesheet" href="../css/YTYanKPrivate.css" />
<script type="text/javascript" src="../js/new_table.js"></script>

<html>
	<head>
		<meta charset="UTF-8">
		<title>vue 模版</title>
	</head>
	<body>
		<div id="vuecode">
			<table-cell v-bind:cell_data="cellData"  son_value="点滴" son_id="smjb-1"  v-on:blockvalue="removeClick" style="background:gold;"></table-cell>
			
		</div>
	</body>
</html>


<script>
	var htmlString = '<div class="manInfo-x-s form-box-man" :id="son_id" data-abc="zb-1"><table class="orm-box-man-nobo"> \
    	                   <tr v-for="(cellv, cellk) in cell_data"> \
	                      <td v-for="(v, k) in cellv" :colspan="v.colspan"> \
	                       <div v-if="v.type == 1">{{v.title}}-{{k}}</div> \
	                       <div v-else-if="v.type == 2"><i-input  v-on="inputListeners"  :placeholder="entry + v.title"  v-model="v.value"/></div></td> \
	                   </tr></table></div>';
	//v-on:input="sonBolockValue"
	// 模块构建
	var tableCell = {
		inheritAttrs: false,
		props:['cell_data', 'son_value', 'son_id'],
		data: function () {
			return {
				entry: '请输入'
			}
		},
		methods: {
		   sonBolockValue($event) { // 调用组件内部方法
		   	alert("添加" + $event);
		   }
		},
		computed: {
			inputListeners: function() { //调用外部方法
				var sonVm = this;
				return Object.assign({}, sonVm.$listeners, {
					input: function(event){
						sonVm.$emit('blockvalue', event)
					}
				})
			}
		},
		template: htmlString
	}

	var vueCode = new Vue({
		el: '#vuecode',
		data: {
			// 举报人信息表格数据模版 - 数据结构
			cellData: tableData,
			msg: '',
		},
		methods: {
			removeClick: function(value) {
				alert("打印--->" + value);
			}
		},
		created: function() {
			
		},
		components: {
			'table-cell': tableCell  // 模版
		}
	});
</script>